<template>
  <el-form :model="upParams" ref="ruleForm" label-width="120px" size="small">
    <div class="wrap">
      <div class="item">
        <el-form-item label="所属区域" prop="agentId"
          :rules="[{ required: true, message: '未选择区域', trigger: ['blur','change'] }]">
          <el-select v-model="upParams.agentId">
            <el-option v-for="list in restaurants" :label="list.name" :value="list.id" :key="list.id" />
          </el-select>
        </el-form-item>

        <el-form-item label="app类型" prop="packageType"
          :rules="[{ required: true, message: 'app类型未选', trigger: ['blur','change'] }]">
          <el-select v-model="upParams.packageType" @change="clearLink">
            <el-option label="用户端" value="1" />
            <el-option label="商家端" value="2" />
            <el-option label="骑手端" value="3" />
            <el-option label="商家pc端" value="4" />
          </el-select>
        </el-form-item>
        <el-form-item v-if="upParams.packageType != '4'" label="设备类型" prop="type"
          :rules="[{ required: true, message: '请选择设备类型', trigger: ['blur','change'] }]">
          <el-select v-model="upParams.type" @change="clearLink">
            <el-option label="安卓" value="1" />
            <el-option label="ios" value="2" />
          </el-select>
        </el-form-item>
        <el-form-item label="修改内容" prop="modifyContent" :rules="[{ required: true, message: '请输入修改内容', trigger: 'blur' }]">
          <el-input type="textarea" :rows="4" placeholder="请输入内容" v-model="upParams.modifyContent" />
        </el-form-item>
      </div>
      <div class="item">
        <el-form-item label="版本号" prop="packageName"
          :rules="[{ required: true, message: '版本号未填写', trigger: 'blur' }]">
          <el-input v-model="upParams.packageName" placeholder="请输入版本号" />
        </el-form-item>
        <div>
          <el-form-item v-if="upParams.type == '1'|| upParams.packageType == '4'"
            :label="upParams.packageType == '4' ? '商家版安装包' : '安卓apk'"
            prop="adrLink" :rules="[{ required: true, message: '请上传文件', trigger: 'change' }]">
            <pt-uptext :size="50" @getUpLoad="getUpLoad" @removeList="removeList" />
          </el-form-item>
        </div>
        <div>
          <el-form-item v-if="upParams.type == '2' && upParams.packageType != 4" label="ios路径" prop="iosLink"
            :rules="[{ required: true, message: '请输入ios下载路径', trigger: 'blur' }]">
            <el-input style="width: 100%" v-model="upParams.iosLink" placeholder="请输入ios下载路径" />
          </el-form-item>
        </div>
      </div>
    </div>
    <el-form-item>
      <el-button type="primary" @click="submitForm('ruleForm')" :loading="isloadingsubmit">保存</el-button>
    </el-form-item>
  </el-form>
</template>
<script>
export default {
  props: {
    upParams: {
      type: Object,
      default: () => {}
    }
  },
  computed: {
    restaurants() { // 区域数据
      return this.$store.state.agentListArea
    }
  },
  data() {
    return {
      isloadingsubmit: false // 上传表单控制
    }
  },
  methods: {
    clearLink() { // 切换清除操作
      this.upParams.iosLink = ""
      this.upParams.adrLink = ""
    },
    getUpLoad(text) { // 添加文件事件
      this.upParams.adrLink = text;
    },
    removeList(text) { // 删除文件事件
      this.upParams.adrLink = ""
    },
    submitForm(ruleForm) {
      this.$refs[ruleForm].validate(valid => {
        if (valid) {
          this.$emit("upText");
        }
      });
    }
  }
};
</script>
<style lang="scss" scoped>
.wrap {
  display: flex;
  .item {
    flex: 1;
  }
}
</style>